@import "./mint.scss";
@import "./variable.scss";

html, body {
  font-size: 12px;
  margin: 0;
  overflow-y: hidden;
  color: #333333;
  font-family: Helvetica, sans-serif;
  position: relative;
  height: 100%;
  overflow: hidden;
  // -webkit-overflow-scrolling: touch;
}
.content{
  text-align: center;
  height: 100%;
  background-color: #f2f2f2;
}
.content-body {
  height: 100%;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.box-size{
  box-sizing: border-box;
}
.bg-white{
  background-color: #fff;
}
.home-content{
  text-align: center;
  margin: px2rem(88px) 0 px2rem(100px) 0;
  position: relative;
  background-color: #f2f2f2;
}
.head-top{  //有head要加
  padding-top: px2rem(88px);
}
.head-bottom{  //有foot要加
  padding-bottom: px2rem(98px);
}
.text-left{
  text-align: left;
}
.text-right{
  text-align: right;
}
.text-center{
  text-align: center;
}
a{
  color: #333;
  text-decoration: none;
}
input::-webkit-input-placeholder{
  color: #999;
}
input::-moz-placeholder{
  color: #999;
}
input:-moz-placeholder{
  color: #999;
}
input:-ms-input-placeholder{
  color: #999;
}
.pl50{
  padding-left: px2rem(50px);
}
.pr50{
  padding-right: px2rem(50px);
}
.pl30{
  padding-left: px2rem(30px);
}
.pr30{
  padding-right: px2rem(30px);
}
.pt40{
  padding-top: px2rem(40px);
}
.pb40{
  padding-bottom: px2rem(40px);
}
.pb20{
  padding-bottom: px2rem(20px);
}
.mt80{
  margin-top: px2rem(80px);
}
.mt60{
  margin-top: px2rem(60px);
}
.mt50{
  margin-top: px2rem(50px);
}
.mt30{
  margin-top: px2rem(30px);
}
.mt-1{
  margin-top: -1px;
}
.mr30{
  margin-right: px2rem(30px);
}
.mr20{
  margin-right: px2rem(20px);
}
.mt20{
  margin-top: px2rem(20px);
}
.mb20{
  margin-bottom: px2rem(20px);
}
.ml30{
  margin-left: px2rem(30px);
}
.ml15{
  margin-left: px2rem(15px);
}
.p10{
  padding: px2rem(10px);
}
.p20{
  padding: px2rem(20px);
}
.pa{
  position: absolute;
}
.pr{
  position: relative;
}
.textabovefrom{
  padding:px2rem(24px);
  text-align: left;
  font-size: px2rem(28px);
  background: #f2f2f2;
  color: #666;
}
.mix1px{            //移动端绝对1像素
  position: relative;
  &:before{
    display: block !important;
    content: '';
    border: none;
    background-color: #ccc;
    height: 1px;
    width: 100%;
    position: absolute;
    bottom: -1px;
    left: 0;
    right: 0;
    -webkit-transform: scaleY(0.5);
    transform: scaleY(0.5);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
  }
}
.mid1px{            //移动端绝对1像素 有留白
  position: relative;
  &:before{
    //display: block !important;
    content: '';
    border: none;
    background-color: #ccc;
    height: 1px;
    position: absolute;
    bottom: -1px;
    left: 10px;
    right: 10px;
    -webkit-transform: scaleY(0.5);
    transform: scaleY(0.5);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
  }
}
.is-danger{
  color: red;
  .mint-field-clear{
    opacity: .8;
  }
}

.tag-inactive{       //未激活标签
  border: solid px2rem(2px);
  font-size: px2rem(24px);
  border-radius: px2rem(24px);
  padding: px2rem(8px) px2rem(12px);
}
.tag-admin{       //管理员标签
  color: #fff;
  font-size: px2rem(22px);
  border-radius: px2rem(8px);
  padding: px2rem(8px) px2rem(12px);
  background-color: #7b78f2;
}
.tag-inaccess{    //权限或类别标签
  width: calc((100% - 30px)/3);
  border: px2rem(2px) solid #d9d9d9;
  padding: px2rem(20px) 0;
  border-radius: px2rem(10px);
  font-size: px2rem(30px);
  color: #666;
  margin-bottom: px2rem(30px);
  margin-right: px2rem(20px);
}
.tag-inaccess:nth-child(3n){
  margin-right: 0;
}
.tag-access{
  border: px2rem(2px) solid #33c584;
  background-color: #33c584;
  color: #fff;
}
.green{
  color: #33c584;
}
.light-red{
  color: #f15b59;
}
.theme-color{
  color: #7b78f2;
}
.light-green{
  color: #66cf8e;
}
.avatar{
  width: px2rem(86px);
  height: px2rem(86px);
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
}
//首页卡片公共样式
.common-card{
  width: 100%;
  .home.mint-cell {
    text-decoration: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -moz-tap-highlight-color: rgba(0, 0, 0, 0);
    -ms-tap-highlight-color: rgba(0, 0, 0, 0);
    -o-tap-highlight-color: rgba(0, 0, 0, 0);
    tap-highlight-color: rgba(0, 0, 0, 0);
    background-color: transparent;
    .mint-cell-mask::after {
      display: none;
    }
  }
  .main-title{   //主标题
    .mint-cell-title{
      font-size: px2rem(32px);
      color: #333;
      font-weight: bold;
    }
    .right-title{
      font-size: px2rem(24px);
      vertical-align: 1px;
    }
    .is-link {
      color: #7b78f2;
    }
    .mint-cell-allow-right::after {
      border-color: #7b78f2;
    }
  }
  .card-data{   //数据展示
    .num{
      display: block;
      font-size: px2rem(40px);
      color: #333;
      font-weight: bold;
      margin-bottom: px2rem(15px);
    }
    .label{
      font-size: px2rem(24px);
      color: #666;
    }
  }
  .sub-title{   //小标题
    font-size: px2rem(28px);
    color: #666;
    text-align:left;
    padding:px2rem(20px) 0 px2rem(30px) px2rem(20px);
    //font-weight: bold;
  }
}
.common-chart{
  width: calc(100% - 2px);
  height:300px;
  z-index: 9;
}
//echarts图下的列表样式
.echarts-list-header{
  line-height: px2rem(80px);
  border-bottom: 1px solid #E6E6E6;
}
.echarts-list-data{
  line-height: px2rem(100px);
  border-bottom: 1px solid #E6E6E6;
  .point{
    width: px2rem(15px);
    height: px2rem(15px);
    border-radius: 50%;
    display: inline-block;
    margin-right: px2rem(10px);
  }
}
.echarts-list-data:nth-child(2n){
  background: #FAFAFA;
}
//省略号处理
.ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
